<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style rel="stylesheet" type="text/css">
        .active{
             background-color: red;
        }
        .aaa{
            background-color: green;
        }
    </style>
</head>
<body>
   <div id="app">

       <a   href="http://www.baidu.com" >百度一下</a>
       <a   v-bind:href="href" >百度一下</a>
        <!--以前-->
       <div class="active" style="width: 300px;height: 100px">
       </div>
       <hr>
       <div  :class="active" style="width: 300px;height: 100px">
       </div>

   </div>
   <!--    {{msg}}-->
       <script src="js/vue.js"></script>
       <script type="text/javascript">
           //1,创建vue对象
           const app = new Vue({
               el:"#app",// 绑定的dom的id   代表vue实例中的数据只在该dom中有效
               data:{//定义一些数据   项目中：异步请求服务端，服务端获取
                  href:"http://www.baidu.com",
                   active:'active'
               },
             methods:{

             }
           });
       </script>

</body>
</html>